import $ from 'jquery'
import '../scss/common.scss'
import '../asset/fonts/iconfont.css'

import header from '../components/header'
import footer from '../components/footer'
import carouse from '../components/carouse'

import IndexModel from '../models/index'
import { IndexCarouse } from '../modules/index'


 

(async ($)=>{
    const $app = $('#app'),
          $container = $('<div class = "container">')          
        
          
    const indexModel = new IndexModel(),
           retData = await indexModel.getCourseDatas(),           
           { swipers, fields, courses } = retData.result

   

    const headerComp = header(fields)
    const footerComp = footer()
    const carouseComp = carouse({swipers, courses})

    function render(){
        $container.append(headerComp.tpl())
        $container.append(carouseComp.tpl())
        $container.append(footerComp.tpl())

        $app.append($container)

        const indexCarouse = new IndexCarouse()
              indexCarouse.init()
    }

    const init = ()=>{
       render()
      
    }

     init()
})($)